<template>
  <el-main>
    <el-row>
      <el-container>
        <el-header><div class="sta-header">高标准农田概况<div class="sta-header-xzq">{{selectXzqName}}</div></div>
          <XzqList ref="xzqlistCom" class="xzqDiv"></XzqList>
        </el-header>
        <el-main>
          <el-row :gutter="20"><!--gutter是左右间隔，表示左右的padding各10px-->
            <el-col v-for="profileValue in profileValues" :span="4">
              <div class="profileValue-label">{{ profileValue.name }}</div>
              <div class="profileValue-value">{{ profileValue.value }}</div>
              <!--              <el-progress :stroke-width="10"-->
              <!--                           :percentage="profileValue.percentage"-->
              <!--                           :show-text="profileValue.hasOwnProperty('showPercentText')&&profileValue.showPercentText"-->
              <!--                           :format="getProgressFormat"-->
              <!--              ></el-progress>-->
            </el-col>
          </el-row>
        </el-main>
      </el-container>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="8">
        <el-container>
          <el-header>已建成项目投资情况（万元）</el-header>
          <el-main>
            <el-col :span="24" class="ct-heigh50">
              <xChartWrapper :item="jdCharts"></xChartWrapper>
            </el-col>
          </el-main>
        </el-container>
      </el-col>
      <el-col :span="16" class="ct-heigh50">
        <el-container>
          <el-header>高标准农田已建成规模
            <el-button-group style="float: right">
              <el-button type="primary" plain icon="el-icon-menu" @click="clickXZQ">行政区</el-button>
              <el-button type="primary" plain icon="el-icon-s-help" @click="clickYear">年度</el-button>
            </el-button-group>
          </el-header>
          <el-main>

            <el-col :span="24" class="ct-heigh50">
              <wrapperItem :item=gbzxmXZQChart v-if="gbxzmShowType==='xzq'"></wrapperItem>
              <wrapperItem :item=gbzxmYearChart v-if="gbxzmShowType==='year'"></wrapperItem>
            </el-col>
          </el-main>
        </el-container>
      </el-col>
    </el-row>
    <el-row>
      <el-container>
        <el-header>高标准农田建成面积(万亩)</el-header>
        <el-main>
          <el-row :gutter="20">
            <el-table
              :data="yjcTable.tableData"
              style="width: 100%"
              :header-cell-style="{background:'#88edaf',color:'#63666b'}"
            >
              <el-table-column
                v-for="(item,i) in yjcTable.tablecols"
                :prop="item.field"
                :label="item.title"
              >
              </el-table-column>
            </el-table>
          </el-row>
        </el-main>
      </el-container>
    </el-row>
  </el-main>
</template>

<script>
import xMoni from '@/components/bigScreen/xWrapper/xMoni'
import xChartWrapper from '@/components/bigScreen/xWrapper/xChartWrapper'
import wrapperItem from '@/components/bigScreen/xWrapper/wrapperItem'
import cc from '@/components/bigScreen/js/commonConfig'
import Bus from '@/utils/bus'
import XzqList from '@/components/Xzq/XzqList'
import {
  getCityYearStaData,
  getGbzRunProjectSta,
  getProvinceYearStaData,
  getGbzCBProjectSta, getUserXZQ
} from '@/api/gbznt/gbzCommon'
import * as globalcf from '@/utils/Global/GlobalCommonFunction'

export default {
  name: 'gbzcbStatis',
  components: { xMoni, xChartWrapper, wrapperItem, XzqList },
  created() {
    this.getXZQYearData(this.xzqData);
    Bus.$on('proStatisChangeXZQ', msg => {
      //msg[0]现在为xzq的对象
      this.getXZQYearData(msg[0])
    })
  },
  mounted() {
    this.getCurrentUserXZQ();
  //  this.$refs.xzqlistCom.changeSelectName('呵呵');
  },
  computed: {},
  data() {
    return {
      selectXzqName:null,
      gbxzmShowType: '',
      profileValues: [
        { type: 'yjcArea', name: '已建成面积（万亩）', value: null, percentage: 100 },
        { type: 'yjcCount', name: '已建成项目数（个）', value: null, percentage: 100, showPercentText: true },
        { type: 'jszArea', name: '正在建设面积（万亩）', value: null, percentage: 50, showPercentText: true },
        { type: 'jszCount', name: '正在建设项目数（个）', value: null, percentage: 30, showPercentText: true },
        { type: 'cbkArea', name: '储备库总面积（万亩）', value: null, percentage: 0 },
        { type: 'cbkCount', name: '储备库项目数（个）', value: null, percentage: 0 }
      ],
      monis: [
        {
          labelOption: {
            title: '耕地保有量',
            value: '54213',
            level: 'green',
            unit: 'km²'
          }
        },
        {
          labelOption: {
            title: '耕地保有量',
            value: '54213',
            level: 'green',
            unit: 'km²'
          }
        },
        {
          labelOption: {
            title: '耕地保有量',
            value: '54213',
            level: 'green',
            unit: 'km²'
          }
        },
        {
          labelOption: {
            title: '耕地保有量',
            value: '54213',
            level: 'green',
            unit: 'km²'
          }
        }
      ],
      jdCharts: {
        type: 'xchart-wrapper', //图表标识
        width: '100%',
        height: '100%',
        chartOption: {
          type: 'pie',
          color: cc.colors.greens,
          legend: { orient: 'horizontal', x: 'right', y: 'bottom', color: '#000000', show: true },
          series: [{
            name: '金额（万元）',
            labelLineShow: true,
            avoidLabelOverlap: false,
            center: ['50%', '50%'],
            data: [
              {
                type: 'tz_zytz',
                name: '中央投资(万元)',
                value: 0
              },
              {
                type: 'tz_dftz',
                name: '地方投资(万元)',
                value: 0
              },
              {
                type: 'tz_shtz',
                name: '社会投资(万元)',
                value: 0
              }
            ]
          }
          ]

        }
      },
      gbzxmXZQChart: {
        type: 'wrapper',
        //  border: { show: true, borderType: 'border2' },
        width: '100%', height: '100%',
        // toolBox: { item: [{ type: 'full-screen', title: '全屏' }] },
        //  spacing: { col: true },
        // title: '高标准农田分布',
        wrapper: [
          {
            type: 'xchart-wrapper',
            width: '100%', height: '100%',
            //scrolling: {y: true},
            chartOption: {
              type: 'bar',
              color: cc.colors.greens,
              axis: {
                axisType: 'x', name: '单位：万亩',
                nameGap: 1,
                color: '#000000',
                rotate: 45,
                //  data: ['哈尔滨市', '齐齐哈尔市', '鸡西市', '鹤岗市', '双鸭山市', '大庆市', '伊春市', '佳木斯市', '七台河市', '牡丹江市', '黑河市', '绥化市', '大兴安岭', '农垦总局'],
                data: [],
                splitLine: {
                  lineStyle: { color: cc.colors.standard1[0], type: 'dotted' }
                }
              },
              label: {
                color: '#000000'
              },
              legend: { show: false, color: '#000000' },
              series: [
                {
                  name: '面积（万亩）', type: 'bar', label: {
                    show: false//是否在柱状图上显示数字
                  },
                  //  data: [215, 15.50, 184.87, 111.21, 65.16, 18.07, 105.48, 21.55, 71.92, 40.21, 18.82, 43.22, 224.16, 291.57]
                  data: []
                }
              ]
            }
          }]
      },
      gbzxmYearChartOriData: [],
      gbzxmYearChart: {
        datachange: 0,
        type: 'wrapper',
        //  border: { show: true, borderType: 'border2' },
        width: '100%', height: '100%',
        // toolBox: { item: [{ type: 'full-screen', title: '全屏' }] },
        //  spacing: { col: true },
        // title: '高标准农田分布',
        wrapper: [{
          type: 'xchart-wrapper',
          width: '100%', height: '100%',
          //scrolling: {y: true},
          chartOption: {
            type: 'bar',
            color: cc.colors.greens,
            axis: {
              axisType: 'x', name: '单位：万亩',
              nameGap: 1,
              color: '#000000',
              rotate: 45,
              data: [],
              // data: ['2011', '2012', '2013', '2014', '2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022', '2023', '2024'],
              splitLine: {
                lineStyle: { color: cc.colors.standard1[0], type: 'dotted' }
              }
            },
            label: {
              color: '#000000'
            },
            legend: { show: false, color: '#000000' },
            series: [
              {
                name: '面积（万亩）', type: 'bar', label: {
                  show: false//是否在柱状图上显示数字
                },
                // data: [50, 100, 84.87, 111.21, 65.16, 18.07, 105.48, 21.55, 71.92, 40.21, 18.82, 43.22, 224.16]
                data: []
              }
            ]
          }
        }]
      },
      typeWrappers: [
        {
          type: 'wrapper',
          width: '100%',
          height: '100%',
          wrapper: [
            {
              type: 'xchart-wrapper', //图表标识
              width: '100%',
              height: '80%',
              chartOption: {
                type: 'liquidfill',
                color: cc.colors.greenRed,
                data: [0.47, 0.42, 0.37]
              }
            },
            {
              type: 'xlabel-wrapper', //文本标识
              width: '100%',
              height: '20%',
              labelStyle: { type: 'title2' },
              labelOption: {
                title: '生态空间',
                trend: {
                  show: true,
                  type: 'down'
                }
              }
            }
          ]
        },
        {
          type: 'wrapper',
          width: '100%',
          height: '100%',
          wrapper: [
            {
              type: 'xchart-wrapper', //图表标识
              width: '100%',
              height: '80%',
              chartOption: {
                type: 'liquidfill',
                color: cc.colors.redHigh,
                data: [0.55, 0.45, 0.35]
              }
            },
            {
              type: 'xlabel-wrapper', //文本标识
              width: '100%',
              height: '20%',
              labelStyle: { type: 'title2' },
              labelOption: {
                title: '城镇空间',
                trend: {
                  show: true,
                  type: 'up'
                }
              }
            }
          ]
        },
        {
          type: 'wrapper',
          width: '100%',
          height: '100%',
          wrapper: [
            {
              type: 'xchart-wrapper', //图表标识
              width: '100%',
              height: '80%',
              chartOption: {
                type: 'liquidfill',
                color: cc.colors.yellowHigh,
                data: [0.70, 0.60, 0.50]
              }
            },
            {
              type: 'xlabel-wrapper', //文本标识
              width: '100%',
              height: '20%',
              labelStyle: { type: 'title2' },
              labelOption: {
                title: '农业空间',
                trend: {
                  show: true,
                  type: 'down'
                }
              }
            }
          ]
        }
      ],
      yjcTable: {  //已建成高标准农田面积统计表
        tableData: [],
        tablecols: [],
        orianData: []
      },
      fieldArray_ch: [
        { 'f_field': 'xzqhdm', 'f_fieldcn': '行政区代码' },
        { 'f_field': 'xzqhmc', 'f_fieldcn': '行政区名称' },
        { 'f_field': 'xmcount', 'f_fieldcn': '项目个数' },
        { 'f_field': 'tz_ztz', 'f_fieldcn': '总投资' },
        { 'f_field': 'tz_zytz', 'f_fieldcn': '中央投资' },
        { 'f_field': 'tz_dftz', 'f_fieldcn': '地方投资' },
        { 'f_field': 'tz_shtz', 'f_fieldcn': '社会投资' },
        { 'f_field': 'zmj', 'f_fieldcn': '总面积' },
        { 'f_field': 'y2011', 'f_fieldcn': '2011年' },
        { 'f_field': 'y2012', 'f_fieldcn': '2012年' },
        { 'f_field': 'y2013', 'f_fieldcn': '2013年' },
        { 'f_field': 'y2014', 'f_fieldcn': '2014年' },
        { 'f_field': 'y2015', 'f_fieldcn': '2015年' },
        { 'f_field': 'y2016', 'f_fieldcn': '2016年' },
        { 'f_field': 'y2017', 'f_fieldcn': '2017年' },
        { 'f_field': 'y2018', 'f_fieldcn': '2018年' },
        { 'f_field': 'y2019', 'f_fieldcn': '2019年' },
        { 'f_field': 'y2020', 'f_fieldcn': '2020年' },
        { 'f_field': 'y2021', 'f_fieldcn': '2021年' },
        { 'f_field': 'y2022', 'f_fieldcn': '2022年' },
        { 'f_field': 'y2023', 'f_fieldcn': '2023年' },
        { 'f_field': 'y2024', 'f_fieldcn': '2024年' },
        { 'f_field': 'y2025', 'f_fieldcn': '2025年' },
        { 'f_field': 'y2026', 'f_fieldcn': '2026年' },
        { 'f_field': 'y2027', 'f_fieldcn': '2027年' },
        { 'f_field': 'y2028', 'f_fieldcn': '2028年' },
        { 'f_field': 'y2029', 'f_fieldcn': '2029年' },
        { 'f_field': 'y2030', 'f_fieldcn': '2030年' },
        { 'f_field': 'y2031', 'f_fieldcn': '2031年' },
        { 'f_field': 'y2032', 'f_fieldcn': '2032年' },
        { 'f_field': 'y2033', 'f_fieldcn': '2033年' },
        { 'f_field': 'y2034', 'f_fieldcn': '2034年' }

      ],
      xzqData:{
        code:"-1",
        level:"-1"
      },
      curUserXZQ:{},
    }
  },
  methods: {
    getProgressFormat(value) {
      return `${value}%`
    },
    getCurrentUserXZQ(){
      getUserXZQ().then(res => {
        let data = res.rows;
          if (data != '') {
            this.curUserXZQ.name=data[0].f_name;
            this.curUserXZQ.code=data[0].f_code;
            this.curUserXZQ.pcode=data[0].f_pcode;
            this.curUserXZQ.level=data[0].f_levels;
            this.$refs.xzqlistCom.selectName= this.curUserXZQ.name;
            this.selectXzqName=this.curUserXZQ.name;
            this.$refs.xzqlistCom.selectValue= this.curUserXZQ.code;
          }
      })
    },
    //从数据库查询图标需要数据
    getXZQYearData(xzq) {
      let that = this
      that.selectXzqName=xzq.label;
      let xzqc={'xzqcode':xzq.code,'xzqlevel':xzq.level};
      that.gbzxmYearChart = Object.assign({}, that.gbzxmYearChart)
      //查询所有已建成高标准农田面积（按照地级市+年份）
      getCityYearStaData(xzqc).then(res => {
        let data = res.rows
        that.yjcTable.orianData = data//这里害怕面积单位转换出问题，保留一个原始的。面积是亩
        if (data != '') {
          data = that.convertAreaunit(data, '2')//对照北大荒一张图，公顷是1，万亩是2，亩是3，平方米是4，平方公里是5。注意高标准默认单位是亩
          //2022年7月5日 LQ 想修改wrapper内部的参数不好使，只能用下面的chartOption.axis.data这样，才会读出来真正数据
          //  that.childXZQArray = that.getChildXZQArray(data);
          that.gbzxmXZQChart.wrapper[0].chartOption.axis.data = that.getChildXZQArray(data)//
          that.gbzxmXZQChart.wrapper[0].chartOption.series[0].data = that.getXZQYearStaListData(data)
          that.yjcTable.tableData = data
          that.yjcTable.tablecols = that.getYjcTable(data)
          that.gbxzmShowType = 'xzq'
          Bus.$emit('reInitXChartsWrapper')
        }
      })
      //查询所有已建成高标准农田面积（全省一条数据+年份）
      getProvinceYearStaData(xzqc).then(res => {
        let data = res.rows
        that.gbzxmYearChartOriData = data
        if (data != '') {
          //1.面积单位 转换
          data = that.convertAreaunit(data, '2')//对照北大荒一张图，公顷是1，万亩是2，亩是3，平方米是4，平方公里是5。注意高标准默认单位是亩
          //2.最上层的几个大统计值。
          this.profileValues.find((item, index) => {
            return item.type == 'yjcArea'//已建成面积
          }).value = data[0].zmj
          this.profileValues.find((item, index) => {
            return item.type == 'yjcCount'//已建成项目个数
          }).value = data[0].xmcount
          //3.中间柱状图，点击了年份之后的图表数据
          let yd = that.getCurrentXZQYearArray(data[0])
          let adata = []
          let serdata = []
          for (let i = 0; i < yd.length; i++) {
            adata.push(yd[i].year)
            serdata.push(yd[i].ydata)
          }
          that.gbzxmYearChart.wrapper[0].chartOption.axis.data = adata
          that.gbzxmYearChart.wrapper[0].chartOption.series[0].data = serdata
        //  this.$forceUpdate();
          //4.投资饼状图
          that.jdCharts.chartOption.series[0].data = that.getTouZiData(data[0])
          this.$nextTick(() => {
            Bus.$emit('reInitXChartsWrapper')
            //   Bus.$emit('resizeXChartsWrapper')//必须resize一下表格，不然就会闪屏
          })
        //  this.$forceUpdate();
          //5.刷新表格
          //2022年7月5日 LQ 哎，如何重新刷新表格用了我好久好久！！！！！,最后还是bus解决的
          //而且行政区+年度这两个图，第二个（年度）表只能v-show，用v-if也是错的，不知道为什么


        }
      })
      //查询正在建设中的项目总面积和数量。
      getGbzRunProjectSta(xzqc).then(res => {
        let data = res.rows
        if (data != '') {
          //1.面积单位 转换
          data = that.convertAreaunit(data, '2')//对照北大荒一张图，公顷是1，万亩是2，亩是3，平方米是4，平方公里是5。注意高标准默认单位是亩
          this.profileValues.find((item, index) => {
            return item.type == 'jszArea'//已建成面积
          }).value = data[0].zmj
          this.profileValues.find((item, index) => {
            return item.type == 'jszCount'//已建成面积
          }).value = data[0].xmcount
        }
      })
      //查询储备库中项目总面积和数量。
      getGbzCBProjectSta(xzqc).then(res => {
        let data = res.rows
        //  that.gbzxmYearChartOriData = data
        if (data != '') {
          //1.注意 储备库本身面积单位就是万亩。 除非后期有改变
          this.profileValues.find((item, index) => {
            return item.type == 'cbkArea'//已建成面积
          }).value = data[0].cbzmj
          this.profileValues.find((item, index) => {
            return item.type == 'cbkCount'//已建成面积
          }).value = data[0].cbcount
        }
      })
      this.$nextTick(() => {
        Bus.$emit('reInitXChartsWrapper')
        //   Bus.$emit('resizeXChartsWrapper')//必须resize一下表格，不然就会闪屏
      })
    },

    getXZQYearData_old() {
      let that = this
      that.gbzxmYearChart = Object.assign({}, that.gbzxmYearChart)
      //查询所有已建成高标准农田面积（按照地级市+年份）
      getCityYearStaData().then(res => {
        let data = res.rows
        that.yjcTable.orianData = data//这里害怕面积单位转换出问题，保留一个原始的。面积是亩
        if (data != '') {
          data = that.convertAreaunit(data, '2')//对照北大荒一张图，公顷是1，万亩是2，亩是3，平方米是4，平方公里是5。注意高标准默认单位是亩
          //2022年7月5日 LQ 想修改wrapper内部的参数不好使，只能用下面的chartOption.axis.data这样，才会读出来真正数据
          //  that.childXZQArray = that.getChildXZQArray(data);
          that.gbzxmXZQChart.wrapper[0].chartOption.axis.data = that.getChildXZQArray(data)//
          that.gbzxmXZQChart.wrapper[0].chartOption.series[0].data = that.getXZQYearStaListData(data)
          that.yjcTable.tableData = data
          that.yjcTable.tablecols = that.getYjcTable(data)
          that.gbxzmShowType = 'xzq'
        }
      })
      //查询所有已建成高标准农田面积（全省一条数据+年份）
      getProvinceYearStaData().then(res => {
        let data = res.rows
        that.gbzxmYearChartOriData = data
        if (data != '') {
          //1.面积单位 转换
          data = that.convertAreaunit(data, '2')//对照北大荒一张图，公顷是1，万亩是2，亩是3，平方米是4，平方公里是5。注意高标准默认单位是亩
          //2.最上层的几个大统计值。
          this.profileValues.find((item, index) => {
            return item.type == 'yjcArea'//已建成面积
          }).value = data[0].zmj
          this.profileValues.find((item, index) => {
            return item.type == 'yjcCount'//已建成项目个数
          }).value = data[0].xmcount
          //3.中间柱状图，点击了年份之后的图表数据
          let yd = that.getCurrentXZQYearArray(data[0])
          let adata = []
          let serdata = []
          for (let i = 0; i < yd.length; i++) {
            adata.push(yd[i].year)
            serdata.push(yd[i].ydata)
          }
          that.gbzxmYearChart.wrapper[0].chartOption.axis.data = adata
          that.gbzxmYearChart.wrapper[0].chartOption.series[0].data = serdata
          //2022年7月5日 LQ 哎，如何重新刷新表格用了我好久好久！！！！！,最后还是bus解决的
          //而且第二个表只能v-show，用v-if也是错的，不知道为什么
          Bus.$emit('reInitXChartsWrapper')
          this.$nextTick(() => {
            Bus.$emit('resizeXChartsWrapper')//必须resize一下表格，不然就会闪屏
          })
        }
      })
      //查询正在建设中的项目总面积和数量。
      getGbzRunProjectSta().then(res => {
        let data = res.rows
        if (data != '') {
          //1.面积单位 转换
          data = that.convertAreaunit(data, '2')//对照北大荒一张图，公顷是1，万亩是2，亩是3，平方米是4，平方公里是5。注意高标准默认单位是亩
          this.profileValues.find((item, index) => {
            return item.type == 'jszArea'//已建成面积
          }).value = data[0].pro_ru_zmj
          this.profileValues.find((item, index) => {
            return item.type == 'jszCount'//已建成面积
          }).value = data[0].pro_ru_count
        }
      })
      //查询储备库中项目总面积和数量。
      getGbzCBProjectSta().then(res => {
        let data = res.rows
        //  that.gbzxmYearChartOriData = data
        if (data != '') {
          //1.注意 储备库本身面积单位就是万亩。 除非后期有改变
          this.profileValues.find((item, index) => {
            return item.type == 'cbkArea'//已建成面积
          }).value = data[0].cbzmj
          this.profileValues.find((item, index) => {
            return item.type == 'cbkCount'//已建成面积
          }).value = data[0].cbcount
        }
      })
    },

    getChildXZQArray(yzdata) {
      let xzqmcs = []
      let len = yzdata.length
      for (let i = 0; i < len; i++) {
        xzqmcs.push(yzdata[i].xzqhmc)
      }
      return xzqmcs
    },
    //获取当前行政区下各年份的统计数据。
    getCurrentXZQYearArray(data) {
      let ydatas = []
      for (let field in data) {
        if (field.length === 5 && field.startsWith('y')) {
          ydatas.push({ year: field.slice(1, 5), ydata: data[field] })
          //   ydatas.push({ year: field.slice(1, 5), ydata: (parseFloat(data[field]) / 10000).toFixed(2) })
        }
      }
      //JSArrayCompare是自己写的一个方法，用于排序
      ydatas.sort(globalcf.JSArrayCompare('year'))
      return ydatas
    },
    getXZQYearStaListData(yzdata) {
      let xzqmcs = []
      let len = yzdata.length
      for (let i = 0; i < len; i++) {
        xzqmcs.push(yzdata[i].zmj)
        //   xzqmcs.push((parseFloat(yzdata[i].zmj) / 10000).toFixed(2))
      }
      return xzqmcs
    },
//高标准农田建成面积表格对应的数据。
    getYjcTable(data) {
      let cols = []
      let curdata = data[0]
      for (let field in curdata) {
        let field_ch = this.fieldArray_ch.find((item, index) => {
          return item.f_field == field
        })
        if (field === 'xzqhdm' || field === 'xmcount'|| field === 'pcode') {
          continue
        } else if (field.startsWith('tz_')||field.startsWith('money')) {//投资信息不显示出来。
          continue
        } else {
          cols.push({
            field: field,
            title: field_ch ? field_ch.f_fieldcn : field,
            align: 'center'
          })
        }
      }
      cols.sort(globalcf.JSArrayCompare('field'))
      return cols

    },
    //获取投资信息
    getTouZiData(data) {
      let info = []
      for (let field in data) {
        if (!field.startsWith('tz_')) {
          continue
        }else if(field==='tz_ztz'){ continue}
        let field_ch = this.fieldArray_ch.find((item, index) => {
          return item.f_field == field
        })
        info.push({
          type: field,
          name: field_ch ? field_ch.f_fieldcn : field,
          value: data[field],
        })

      }
      return info

    },
    //面积坐标转换,高标准农田面积默认是亩.所以需要转换
    convertAreaunit(data, unitType) {
      let len = data.length
      for (let i = 0; i < len; i++) {
        let curdata = data[i]
        for (let field in curdata) {
          if (field.length === 5 && field.startsWith('y')) {//面积的
            if (unitType === '2') {//万亩
              curdata[field] = (parseFloat(curdata[field]) / 10000).toFixed(2)
            }
          }
          if (field.indexOf('zmj') > -1) {
            if (unitType === '2') {//万亩
              curdata[field] = (parseFloat(curdata[field]) / 10000).toFixed(2)
            }
          }
        }
      }
      return data
    },

    clickXZQ() {
      this.gbxzmShowType = 'xzq'
      this.$nextTick(() => {
        Bus.$emit('reInitXChartsWrapper')
     //   Bus.$emit('resizeXChartsWrapper')//必须resize一下表格，不然就会闪屏
      })
    },
    clickYear() {
      this.gbxzmShowType = 'year'

      this.$nextTick(() => {
        Bus.$emit('reInitXChartsWrapper')
        Bus.$emit('resizeXChartsWrapper')//必须resize一下表格，不然就会闪屏
      })
    }
  }
}
</script>

<style lang="css" scoped>
.sta-header{
  float: left;

}
.sta-header-xzq{
  /*float: right;*/
  font-size: 40px;
  display: inline-block;
  margin: 0 0 0 30vw;
  color: #058b47;
}
.xzqDiv {
  float: right;
  width:150px;
}

::v-deep .xzqDiv .el-input--medium .el-input__inner {
  height: 26px;
  line-height: 26px;
  /*font-size: large;*/
  /*font-weight: bolder;*/
  /*background-color: #baf6d1;*/
}

.profileValue-label {
  font-size: 16px;
  padding-bottom: 5px;
}

.profileValue-value {
  font-size: 36px;
  font-weight: bolder;
  color: #37b667;
}

.el-container {
  border: 1px #eee solid;
  border-radius: 4px;
}
</style>
<style lang="scss" scoped>
.ct-heigh50 {
  height: 50vh;
}

.el-row {
  margin-bottom: 20px;

  &:last-child {
    margin-bottom: 0;
  }
}

.el-header {
  height: 40px !important;
  line-height: 40px;
  font-size: 16px;
  font-weight: bolder;
  border-bottom: 1px solid #eee;
}

::v-deep {
  .xlabel-wrapper-left .label-title, .xlabel-wrapper-left1 .label-title, .xlabel-wrapper-left .label-unit, .xlabel-wrapper-left1 .label-unit {
    color: #fff;
  }

  .xlabel-wrapper-left > a {
    line-height: 0px;
  }

  .xchart-wrapper {
    min-height: 200px;
  }

  .xpanel-label, .xchart-wrapper, .xchart-title2 {
    background-color: rgba(255, 255, 255, 0);
    border: 0px;
    border-radius: 4px;
  }

  .fill-h {
    text-align: center;
  }

  .xchart-title2 {
    display: inline-block;
    padding: 0px 5px;
  }
}
</style>
